<template>
    <el-row v-loading.body="listLoading" element-loading-text="正在查询，请稍后...">
        <iframe id="pdf_frame" frameborder="0" width="100%" height="800" style="margin-top: 20px"></iframe>
    </el-row>
</template>
<script>

    import { getOrder } from '@/api/order/order.js';
    import { parseTime } from '@/utils/time';

    import "pdfmake/build/pdfmake";
    import "pdfmake/build/vfs_fonts";

    export default {
        props:{
            order_id: {
                default: 0
            },
        },
        data() {
            return {
                order: null,
                pdfData : null,
                listLoading: false,
            };
        },
        created(){
            this.fetchData();
        },
        methods: {
            fetchData() {
                this.listLoading = true;
                getOrder(this.order_id).then(response => {
                    this.order = response.data;
                    this.pdfInit(this.order);
                    this.listLoading = false;
                });
            },
            contract_download(){
                pdfMake.createPdf(this.pdfData).download(this.order.orderContract.contract_number+".pdf");
            },
            contract_print(){
                pdfMake.createPdf(this.pdfData).print();
            },
            getBody(order){
                var bodyarry = [];

                bodyarry.push([{
                        columns:[
                            {text:'始发站：'+order.orderCustomer.send_addr,style:'table'},
                            {text:'目的站：'+order.orderCustomer.recive_addr,style:'table'},
                        ],
                        colSpan: 11
                    },{},{},{},{},{},{},{},{},{},{}]
                );
                bodyarry.push([
                    {
                        columns:[
                            [
                                {
                                    columns:[
                                        [
                                            {text:'发货人：'+order.orderCustomer.send_name,style:'table'},
                                            {text:'电话：',style:'table'},
                                        ],
                                        [
                                            {text:'单位',style:'table'},
                                            {text:'手机'+order.orderCustomer.send_phone,style:'table'},
                                        ]
                                    ]
                                },
                                {text:'地址：'+order.orderCustomer.send_addr + ' ' + order.orderCustomer.send_addr_info,style:'table'},
                            ],
                        ],
                        colSpan: 6
                    },
                    {},{},{},{},{},
                    {
                        columns:[
                            [
                                {
                                    columns:[
                                        [
                                            {text:'收货人：'+order.orderCustomer.recive_name,style:'table'},
                                            {text:'电话：',style:'table'},
                                        ],
                                        [
                                            {text:'单位',style:'table'},
                                            {text:'手机'+order.orderCustomer.recive_phone,style:'table'},
                                        ]
                                    ]
                                },
                                {text:'地址：'+order.orderCustomer.recive_addr + ' ' + order.orderCustomer.recive_addr_info,style:'table'},
                            ],
                        ],
                        colSpan: 5},
                    {},{},{},{}]);
                bodyarry.push([
                    {text:'品名',style:'table'},
                    {text:'包装',style:'table'},
                    {text:'件数',style:'table'},
                    {text:'重量',style:'table'},
                    {text:'体积',style:'table'},
                    {text:'计费方式',style:'table'},
                    {text:'运费',style:'table'},
                    {text:'包装费',style:'table'},
                    {text:'声明价值',style:'table'},
                    {text:'保险费',style:'table'},
                    {text:'代收货款',style:'table'}]);
                var number = 0;
                var weight = 0;
                order.orderGoods.forEach(function(value, index, array) {
                    bodyarry.push([
                        {text:value.name,style:'table'},
                        {text:'',style:'table'},
                        {text:value.number,style:'table'},
                        {text:value.weight,style:'table'},
                        {text:value.size,style:'table'},
                        {text:'',style:'table'},
                        {text:value.freight,style:'table'},
                        {text:'',style:'table'},
                        {text:'',style:'table'},
                        {text:'',style:'table'},
                        {text:'',style:'table'}]);
                    number += value.number;
                    weight += value.weight;
                });
                bodyarry.push([
                    {text:'合计',style:'table'},
                    {text:'',style:'table'},
                    {text:number,style:'table'},
                    {text:weight,style:'table'},
                    {text:'',style:'table'},
                    {text:'',style:'table'},
                    {text:order.orderTaking.freight,style:'table'},
                    {text:'',style:'table'},
                    {text:'',style:'table'},
                    {text:order.orderTaking.safes,style:'table'},
                    {text:'',style:'table'}]);
                bodyarry.push([
                    {text:'回单要求',style:'table',colSpan: 3},
                    {},
                    {},
                    {text:'回单份数',style:'table',colSpan: 3},
                    {},
                    {},
                    {text:'费用合计',style:'table'},
                    {text:'现付',style:'table'},
                    {text:'到付',style:'table'},
                    {text:'回付',style:'table'},
                    {text:'月结',style:'table'}]);
                bodyarry.push([
                    {text:'',style:'table',colSpan: 3},
                    {},
                    {},
                    {text:'',style:'table',colSpan: 3},
                    {},
                    {},
                    {text:order.orderTaking.recive,style:'table'},
                    {text:'大写：\t'+ this.DX(order.orderTaking.recive),style:'table',colSpan: 4},
                    {},
                    {},
                    {},]);
                bodyarry.push([
                    {text:'备注：',style:'table',colSpan: 3},
                    {},
                    {},
                    {text:'温馨提示：\n您的签名表明您已理解本运单及法律含义并接受其约定。\n\n托运人签署：',style:'table',colSpan: 4},
                    {},
                    {},
                    {},
                    {
                        columns:[
                            [
                                {
                                    columns:[
                                        [
                                            {text:'填开人：',style:'table'},
                                            {text:'收货人：'+order.orderCustomer.recive_name,style:'table'},
                                        ],
                                        [
                                            {text:'填开时间：',style:'table'},
                                            {text:'收货时间：'+this.day(order.orderCustomer.recive_time),style:'table'},
                                        ]
                                    ]
                                },
                                {text:'收货人证件号码：',style:'table'},
                            ],
                        ],
                        style:'table',colSpan: 4
                    },
                    {},
                    {},
                    {},]);
                return bodyarry;
            },
            pdfInit(order){
                this.pdfData = {
                    pageSize:'A4',
                    pageOrientation: 'landscape',
                    content: [
                        {
                            width: 130,
                            image:this.getImage()
                        },
                        { text: '托运单', style: 'title'},
                        { text: 'NO:'+order.order.order_number, style: 'title2'},
                        {
                            table: {
                                widths:[55,55,55,55,55,55,65,65,65,65,'*'],
                                body: this.getBody(order)
                            }
                        },
                    ],
                    styles: {
                        title: {
                            fontSize: 22,
                            bold: true,
                            alignment: 'center',
                            margin: [0, 10, 0, 20]
                        },
                        title2: {
                            fontSize: 13,
                            alignment: 'right',
                            margin: [0, 0, 0, 5]
                        },
                        body: {
                            fontSize: 11,
                            margin: [0, 5, 0, 5]
                        },
                        table: {
                            fontSize: 11,
                            margin: [0, 5, 0, 5]
                        },
                        table2: {
                            fontSize: 11,
                            margin: [0, 10, 0, 10]
                        },
                        h1: {
                            fontSize: 12,
                            bold:true,
                            margin: [0, 10, 0, 10]
                        },
                    },
                    defaultStyle: {
                        font: 'fzlt'
                    }
                };

                pdfMake.fonts = {
                    fzlt: {
                        normal: 'fzlt.ttf',
                        bold: 'fzlt.ttf',
                        italics: 'fzlt.ttf',
                        bolditalics: 'fzlt.ttf',
                    }
                };
                const pdfDocGenerator = pdfMake.createPdf(this.pdfData);
                pdfDocGenerator.getDataUrl((dataUrl) => {
                    document.getElementById('pdf_frame').src = dataUrl;
                });
            },
            time: function (value) {
                return parseTime(value,"{y}年{m}月{d}日 {hh}:{mm}:{dd}");
            },
            day: function (value) {
                return parseTime(value,"{y}年{m}月{d}日");
            },
            DX: function(n) {
        if (!/^(0|[1-9]\d*)(\.\d+)?$/.test(n))
            return "数据非法";
        var unit = "千百拾亿千百拾万千百拾元角分", str = "";
        n += "00";
        var p = n.indexOf('.');
        if (p >= 0)
            n = n.substring(0, p) + n.substr(p+1, 2);
        unit = unit.substr(unit.length - n.length);
        for (var i=0; i < n.length; i++)
            str += '零壹贰叁肆伍陆柒捌玖'.charAt(n.charAt(i)) + unit.charAt(i);
        return str.replace(/零(千|百|拾|角)/g, "零").replace(/(零)+/g, "零").replace(/零(万|亿|元)/g, "$1").replace(/(亿)万|壹(拾)/g, "$1$2").replace(/^元零?|零分/g, "").replace(/元$/g, "元整");
    },
            getImage(){
                return '';
            }

        }
    }
</script>


